import React, { Component } from 'react';
import {Button} from 'antd'
import {SketchOutlined} from '@ant-design/icons'
import './own_home.less'
class OwnHome extends Component {
  state={}
  componentDidMount(){

  }

  render() {
    const {memberStudyCourse,memberPublishBlog} = this.props
    const {phone,nickname,level,gmtCreate} = this.props.memberInfo
    return (
      <div className="home-box">
        <div className="left-box">
          <h1>欢迎来到个人中心</h1>
          <ul>
            <li>
              <h2>{memberPublishBlog ? memberPublishBlog.length : 0 }</h2>
              <div>文章数</div>
            </li>
            <li>
              <h2>{memberStudyCourse ? memberStudyCourse.length : 0 }</h2>
              <div>学习数</div>
            </li>
          </ul>
        </div>
        <div className="right-box">
          <Button icon={<SketchOutlined />} type="primary">开通VIP享受更多特权</Button>
          <div className="my-info">
            <h3>账号信息</h3>
            <ul>
              <li>
                电话：{phone}
              </li>
              <li>
                昵称：{nickname}
              </li>
              <li>
                等级：LV{level}
              </li>
              <li>
                注册时间：{gmtCreate ? gmtCreate.substring(0,10) :'无'}
              </li>
            </ul>
          </div>
        </div>
      </div>
    );
  }
}

export default OwnHome;